<template>
  <div class="Chief-Five" chief-style-set>
    <Title title='投入产出' more :MoreUrl='MoreJump(this, "Financial", 2)'></Title>
    <div class="content-h-auto" chief-style-set>
      <Charts :pChartsOption='ChartsOption'></Charts>
    </div>
  </div>
</template>

<script>
import Title from "@/components/baseTitle";
import Charts from "@/components/portalEcharts/BarEcharts";
import { rptVisPrjInoutput } from "@/api/portalChief";
import { MoreJump } from "@/util/util";
export default {
  name: "Chief-Five",
  components: {
    Title, Charts
  },
  data () {
    return {
      ChartsOption: {},
      MoreJump
    };
  },
  created () {
    rptVisPrjInoutput(this.$store.state.user.project.projectNo).then(res => {
      this.disposeData(res);
    });
  },
  methods: {
    // eslint-disable-next-line valid-jsdoc
    /**
    * 方法描述描述
    * @param {Object} res 参数作用
    */
    disposeData (res) {
      if (res.status === 200 && res.data.code === 0 && res.data.data.length > 0) {
        this.ChartsOption = {
          xAxisNameList: ["项目总投入（总投入完成金额）", "项目总产出（累计销售额）"],
          BarList: [
          ]
        };
        let list = res.data.data;
        if (list.length > 0) {
          list.forEach((item, index) => {
            this.ChartsOption.BarList.push({
              name: item.name,
              barWidth: 40,
              data: Object.values(item.data)
            });
          });
        } else {
          this.ChartsOption = {};
        }
      } else {
        this.ChartsOption = {};
      }
    }
  }
};
</script>